import React from 'react'
import { Table, Popconfirm, message } from 'antd'
import { withRouter } from 'react-router-dom'
import PropTypes from 'prop-types'
import API from '../../api/Goods/goods'

class IcsComponentsIdleGrid extends React.Component {
    state = {
    }
    componentDidMount () {
    }
    edit = (row) => {
        this.props.history.push("/goods/detail/index",{goods_id: row.goods_id, cat_id: row.cat_id, cat_name: row.cat_name})
    }
    shelve = (type, goods_id) => {
        API.doShelve({is_on_sale: type, goods_id: goods_id}).then(res => {
            if (res.error === 0) {
                this.props.doSearch()
            } else {
                message.error(res.message || '操作失败')
            }
        })
    }
    render () {
        return (
            <div className="manager-grid">
                <Table
                    dataSource={this.props.list}
                    pagination={false}
                    bordered
                    rowKey="goods_id">
                    <Table.Column
                        title="商品ID"
                        width={120}
                        dataIndex="goods_id"
                    />
                    <Table.Column
                        title="商品名称"
                        dataIndex="goods_name"
                        width={150}
                    />
                    <Table.Column
                        title="价格"
                        width={120}
                        dataIndex="sale_price"
                    />
                    <Table.Column
                        title="归属商城"
                        width={120}
                        dataIndex="shop_id"
                        render={(text, row) => {
                            return '商城一'
                        }}
                    />
                    <Table.Column
                        title="品类"
                        width={120}
                        dataIndex="cat_name"
                    />
                    <Table.Column
                        title="归属商家"
                        width={150}
                        dataIndex="shop_name"
                    />
                    <Table.Column
                        title="在售门店"
                        width={150}
                        dataIndex="store_name"
                        render={(text, row) => {
                            return text.map((v, index) => <div key={index}>{v}</div>)
                        }}
                    />
                    <Table.Column
                        title="上架状态"
                        width={150}
                        dataIndex="is_on_sale"
                        render={(text, row) => {
                            if (parseInt(row.is_on_sale, 10) === 1) {
                                return '上架'
                            } else {
                                return '未上架'
                            }
                        }}
                    />
                    <Table.Column
                        title="收藏数量"
                        width={150}
                        dataIndex="collect_num"
                    />
                    <Table.Column
                        title="操作"
                        width={150}
                        render={(text, row) => {
                            return <div>
                                {row.is_on_sale === '0' ? <a onClick={() => this.edit(row)}>编辑&nbsp;</a> : ''}
                                {row.is_on_sale === '1' ?
                                    <Popconfirm title="确定下架吗?" onConfirm={() =>this.shelve(0, row.goods_id)} okText="Yes" cancelText="No"><a>下架</a></Popconfirm>: <Popconfirm title="确定上架吗?" onConfirm={() =>this.shelve(1, row.goods_id)} okText="Yes" cancelText="No"><a>上架</a></Popconfirm>}
                            </div>
                        }}
                    />
                </Table>
            </div>
        )
    }
}

IcsComponentsIdleGrid.propTypes = {
    onCreate: PropTypes.func,
    onIdleDetail: PropTypes.func,
    list: PropTypes.array,
    doSearch: PropTypes.func,
    grid: PropTypes.any
}
export default withRouter(IcsComponentsIdleGrid)
